<template>
	<view v-if="params.url">
		<web-view :webview-styles="webviewStyles" :src="`${params.url}`" @message="message"></web-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				params: {},
				webviewStyles: {
					progress: {
						color: "#FF3333"
					}
				},
			}
		},
		props: {
			src: {
				type: [String],
				default: null
			}
		},
		onLoad(event) {
			this.params = event
			if (event.title) {
				uni.setNavigationBarTitle({
					title: event.title
				})
			}
			if (this.params.progress == 'no') {
				this.webviewStyles = {}
			}
			
		},
		methods: {
			message(res) {

				let address = {
					// 1 开头的App路径
					1001: {
						mode: "app",
						url: "/pages/login"
					},
					// 2 开头的H5路径
					2001: {
						mode: "h5",
						url: "/static/webview/demo/noheader.html",
						noHeader: true
					},
				}

				if (res.type == 'message') {
					if (res.detail && res.detail.data && res.detail.data[0]) {


						if (res.detail.data[0]["action"] == "main") {
							console.log(res.detail.data[0]["message"])
						}

						if (res.detail.data[0]["action"] == "closeWebView") {
							uni.navigateBack({delta:1})
						}

						if (res.detail.data[0]["action"] == "navigateTo") {
							let url = address[res.detail.data[0]["id"]]['url']
							let mode = address[res.detail.data[0]["id"]]['mode']
							if (mode == "app") {
								this.$tab.navigateTo(url);
							} else if (mode == "h5") {

								let noHeader = address[res.detail.data[0]["id"]]['noHeader']
								if (noHeader) {
									this.$tab.navigateTo(
									`/pages/common/nohdview/index?title=内置web&url=${url}&progress=no`);
								} else {
									this.$tab.navigateTo(`/pages/common/webview/index?title=内置web&url=${url}&progress=no`);
								}

							}

						}

					}
				}
			}
		}
	}
</script>